<!DOCTYPE html>
<html>
<head>
    <title>商品属性表</title>
		<#include "/header.html">
    <link rel="stylesheet" href="${request.contextPath}/statics/css/bootstrap-table.min.css">
    <link rel="stylesheet" href="${request.contextPath}/statics/plugins/treegrid/jquery.treegrid.css">
    <script src="${request.contextPath}/statics/libs/bootstrap-table.min.js"></script>
    <script src="${request.contextPath}/statics/plugins/treegrid/jquery.treegrid.min.js"></script>
    <script src="${request.contextPath}/statics/plugins/treegrid/jquery.treegrid.bootstrap3.js"></script>
    <script src="${request.contextPath}/statics/plugins/treegrid/jquery.treegrid.extension.js"></script>
    <script src="${request.contextPath}/statics/plugins/treegrid/tree.table.js"></script>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <form class="form-inline" role="form">
                <a class="btn btn-default btn-sm" @click="reset"><i class="fa fa-refresh"></i></a>
                <div class="form-group">
                    <input type="text" class="form-control input-sm" v-model="q.attributeName" @keyup.enter="query" placeholder="规格名称">
                </div>&nbsp;&nbsp;&nbsp;
                <div class="form-group">
                    <input type="text" class="form-control input-sm" v-model="q.attributeId" @keyup.enter="query" placeholder="规格id">
                </div>&nbsp;&nbsp;&nbsp;
                <div class="form-group">
                    <!--<input type="text" class="form-control input-sm" v-model="q.attributeType" @keyup.enter="query" placeholder="规格id">-->
                    <select class="form-control" v-model="q.attributeType">
                        <option class="form-control" value="">规格类型</option>
                        <option class="form-control" value="normal">规格</option>
                        <option class="form-control" value="craft">工艺</option>
                    </select>
                </div>&nbsp;&nbsp;&nbsp;
                <a class="btn btn-default btn-sm"  @click="query"><i class="fa fa-search"></i>&nbsp;查询</a>
                <#if shiro.hasPermission("goods:goodsattribute:save")>
                    <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
                </#if>
                <#if shiro.hasPermission("goods:goodsattribute:update")>
                    <a class="btn btn-primary" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
                </#if>
                <#if shiro.hasPermission("goods:goodsattribute:delete")>
                    <a class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
                </#if>
            </form>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>

    <div v-show="!showList" class="panel panel-default">
        <div class="panel-heading">{{title}}</div>
        <form class="form-horizontal" style="width: 100%;">
            <div class="form-group">
                <div class="col-sm-2 control-label">属性名称</div>
                <div class="col-sm-2">
                    <input type="text" class="form-control" v-model="goodsAttribute.attributeName" placeholder="请输入属性名称"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">属性类型</div>
                <div class="col-sm-2">
                    <select v-if="goodsAttribute.attributeId == undefined" class="form-control" v-model="goodsAttribute.attributeType">
                        <option class="form-control"  value="normal">普通</option>
                        <option class="form-control"  value="craft">工艺</option>
                    </select>
                    <select v-else class="form-control" disabled="disabled" v-model="goodsAttribute.attributeType">
                        <option class="form-control"  value="normal">普通</option>
                        <!--<option class="form-control"  value="material">材料</option>-->
                        <option class="form-control"  value="craft">工艺</option>
                        <!--<option class="form-control"  value="design">设计</option>-->
                    </select>
                    <!--<input v-else type="text" class="form-control" readonly="true" v-model="goodsAttribute.attributeType" placeholder="属性类型"/>-->
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">是否成品尺寸</div>
                <div class="col-sm-2">
                    <select class="form-control" v-model="goodsAttribute.attributeValueKey">
                        <option class="form-control" value="size">成品尺寸</option>
                        <option class="form-control" value="none">无</option>
                    </select>
                </div>
            </div>
            <!--<div class="form-group">-->
                <!--<div class="col-sm-2 control-label">是否影响sku单价计算</div>-->
                <!--<div class="col-sm-2">-->
                    <!--&lt;!&ndash;<select  class="form-control" v-model="goodsAttribute.influenceCraftType">&ndash;&gt;-->
                        <!--&lt;!&ndash;<option class="form-control"  value="none">无影响</option>&ndash;&gt;-->
                        <!--&lt;!&ndash;<option class="form-control"  value="single">单价</option>&ndash;&gt;-->
                        <!--&lt;!&ndash;<option class="form-control"  value="total">总价</option>&ndash;&gt;-->
                        <!--&lt;!&ndash;<option class="form-control"  value="craftTotal">工艺总价</option>&ndash;&gt;-->
                    <!--&lt;!&ndash;</select>&ndash;&gt;-->
                    <!--<el-switch-->
                            <!--style="display: block"-->
                            <!--v-model="goodsAttribute.influenceCraftType"-->
                            <!--active-color="#87CEFF"-->
                            <!--inactive-color="#F2F2F2"-->
                            <!--active-text="影响"-->
                            <!--inactive-text="不影响">-->
                    <!--</el-switch>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="form-group">-->
                <!--<div class="col-sm-2 control-label">规格类型</div>-->
                <!--<div class="col-sm-2">-->
                    <!--<select v-if="goodsAttribute.attributeId == undefined"  class="form-control" v-model="goodsAttribute.classify">-->
                        <!--<option class="form-control"  value="">请选择规格类型</option>-->
                        <!--<option class="form-control"  value="1">页数</option>-->
                        <!--<option class="form-control"  value="2">尺寸</option>-->
                        <!--<option class="form-control"  value="3">数字</option>-->
                        <!--<option class="form-control"  value="4">图片</option>-->
                        <!--<option class="form-control"  value="5">文字</option>-->
                        <!--<option class="form-control"  value="6">大纸</option>-->
                    <!--</select>-->
                    <!--<select v-else class="form-control" disabled="disabled" v-model="goodsAttribute.classify">-->
                        <!--<option class="form-control"  value="">请选择规格类型</option>-->
                        <!--<option class="form-control"  value="1">页数</option>-->
                        <!--<option class="form-control"  value="2">尺寸</option>-->
                        <!--<option class="form-control"  value="3">数字</option>-->
                        <!--<option class="form-control"  value="4">图片</option>-->
                        <!--<option class="form-control"  value="5">文字</option>-->
                        <!--<option class="form-control"  value="6">大纸</option>-->
                    <!--</select>-->
                    <!--&lt;!&ndash;<input v-else type="text" class="form-control" readonly="true" v-model="goodsAttribute.classify" placeholder="规格类型"/>&ndash;&gt;-->
                <!--</div>-->
            <!--</div>-->
            <div class="form-group">
                <div class="col-sm-2 control-label">三级分类</div>
                <div class="col-sm-2">
                    <!--<div v-if="goodsAttribute.attributeId == undefined">-->
                    <!--<div v-if="goodsAttribute.categoryId == undefined">-->
                        <input type="text" class="form-control" v-model="goodsAttribute.categoryName" @click="goodsCategoryTree" readonly="true" placeholder="请选择分类"/>
                    <!--</div>-->
                    <!--<div v-else>-->
                        <!--<input type="text" class="form-control" v-model="goodsAttribute.categoryName" readonly="true"/>-->
                    <!--</div>-->
                </div>
            </div>
            <!--<div class="form-group" >-->
                <!--<div class="col-sm-2 control-label">属性排序</div>-->
                <!--<div class="col-sm-10">-->
                    <!--<input type="text" class="form-control" v-model="goodsAttribute.attributeSort" placeholder="属性排序"/>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="form-group">-->
                <!--<div class="col-sm-2 control-label">创建人</div>-->
                <!--<div class="col-sm-10">-->
                    <!--<input type="text" class="form-control" v-model="goodsAttribute.createName" placeholder="创建人"/>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="form-group">-->
                <!--<div class="col-sm-2 control-label">创建时间</div>-->
                <!--<div class="col-sm-10">-->
                    <!--<input type="text" class="form-control" v-model="goodsAttribute.createTime" placeholder="创建时间"/>-->
                <!--</div>-->
            <!--</div>-->
            <div class="form-group">
                <div class="col-sm-2 control-label">规格属性值</div>
                <div class="col-sm-10">
                    <table style="text-align: center;" class="controls table-striped table-bordered table-condensed">
                        <thead>
                            <tr><td>规格属性名</td><td>规格属性值</td><td>操作</td></tr>
                        </thead>
                        <tbody v-if="goodsAttribute.attributeId != undefined">
                            <tr v-for="(goodsOption,index) in goodsOptionList">
                                <td><input readonly="true" class="form-control" v-model="goodsOption.optionName"/></td>
                                <td><input readonly="true" class="form-control" v-model="goodsOption.optionValue"/></td>
                                <td><a @click="deleteOption(goodsOption.optionId,index)">删除</a>
                                    <a @click="updateOption(goodsOption.optionId,goodsOption.optionName,goodsOption.optionValue,index)">修改</a></td>
                            </tr>
                            <tr><td><a @click="addOption(goodsAttribute.attributeId)">添加规格属性值</a></td></tr>
                        </tbody>
                        <tbody v-else>
                            <tr v-for="(goodsOption,index) in goodsOptionList">
                                <td><input  class="form-control" v-model="goodsOption.optionName"/></td>
                                <td><input  class="form-control" v-model="goodsOption.optionValue"/></td>
                                <td><a @click="delOption(index)">删除</a>
                                    <!--<a @click="udtOption(index)">修改</a></td>-->
                            </tr>
                            <tr><td><a @click="newlyOption(goodsAttribute.attributeId)">新增规格属性值</a></td></tr>
                        </tbody>
                    </table>
                    <!--<li><a @click="addOption(goodsAttribute.attributeId)">添加规格属性值</a></li>-->
                </div>
                <!--<input type="button" class="btn btn-primary btn-sm" @click="updateAttributeValues" value="保存规格属性值"/>-->
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
            </div>
        </form>
    </div>
<!--规格值详细 -->
<div id="optionLayer" style="display: none;">
    <div class="form-group">
        <ul>
            <li>
                <span>选项名</span>
                <span>选项值</span>
            </li>
            <li v-for="goodsOption in goodsOptionList">
                <span>{{goodsOption.optionName}}</span>
                <span>{{goodsOption.optionValue}}</span>
            </li>
        </ul>
    </div>
</div>
<!--规格值详细 -->
<div id="addOptionLayer" style="display: none;">
    <div class="form-group">
        请输入规格名称:
        <input type="text" class="form-control"  v-model="option.optionName"  />
        请输入规格值:
        <input type="text" class="form-control" v-model="option.optionValue"  />
    </div>
</div>
<!-- 选择三级分类 -->
<div id="goodsCategoryLayer" style="display: none;padding:10px;">
    <ul id="goodsCategoryTree" class="ztree"></ul>
</div>

</div>


<script src="${request.contextPath}/statics/js/modules/goods/goodsattribute.js?_${.now?long}"></script>
</body>
</html>